<template>
  <div class="app-container">
    <TableFilter :data="filter" v-model="query" ref="filter" @change="changeFilter"></TableFilter>
    <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
      <el-tab-pane label="入组明细" name="rzmx">
        <Rzmx :query="query" ref="rzmx" />
      </el-tab-pane>
      <el-tab-pane label="入组汇总" name="rzhz">
        <Rzhz :query="query" ref="rzhz" />
      </el-tab-pane>
      <el-tab-pane label="科室汇总" name="deptHz">
        <DeptHz :query="query" ref="deptHz" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script lang="ts">
import TableFilter from "@/components/TableFilter";
import Rzmx from "./rzmx.vue";
import Rzhz from "./rzhz.vue";
import DeptHz from "./deptHz.vue";
import { dept2doc } from "@/api/patient";
import dayjs from "@/utils/dayjs.min.js";
import { UserModule } from "@/store/modules/user";
// import { UserModule } from "@/store/modules/user";
import { Component, Vue } from "vue-property-decorator";
@Component({
  name: "drgrzmx",
  components: {
    Rzmx,
    Rzhz,
    DeptHz,
    TableFilter,
  },
  computed: {
    filter() {
      return {
        date: {
          props: {
            options: [{ label: "结算时间", value: 0 }],
            isTwoRange: true,
            type: "daterange",
            format: "yyyy-MM-dd",
            valueFormat: "yyyy-MM-dd",
          },
          keys: ["timeType", "kssj", "jssj"],
        },
        inline: [
          {
            props: {
              label: "科室",
              is: "el-select",
              filterable: true,
              options: this.deptList,
            },
            keys: "ksmc",
          },
          {
            props: {
              label: "关键字",
              is: "el-input",
            },
            data: {
              attrs: {
                placeholder: "姓名/住院号/drg编码/名称",
              },
            },
            keys: "keys",
          },
          {
            props: {
              label: "盈亏",
              is: "el-select",
              filterable: true,
              options: [
                { label: "所有", value: 1 },
                { label: "盈利", value: 2 },
                { label: "亏损", value: 3 },
              ],
            },
            keys: "profit",
          },
        ],
      };
    },
  },
})
export default class extends Vue {
  private activeName: any = "rzmx";
  private handleClick() { }
  private deptList: any = [];
  private query: any = {
    timeType: 0,
    kssj: dayjs().subtract(1, "month").format("YYYY-MM-DD"),
    jssj: dayjs().format("YYYY-MM-DD"),
    ksmc: "",
    keys: "",
  };
  private async created() {
    await this.getDepts();
    this.$nextTick(() => {
      (<any>this.$refs.rzmx).getData();
      (<any>this.$refs.rzhz).getData();
      (<any>this.$refs.deptHz).getData();
    });
  }
  public async getDepts() {
    let d: any = await dept2doc({ t: dayjs().format("YYYYMMDD") });

    d = d.data || [];
    let userdepts = await UserModule.GetUsername2depts();
    let deptts = Array.from(new Set(d.map((it: any) => it.科室)));
    this.deptList = [];
    //医生只查自己科室的
    if (userdepts.length > 0) {
      deptts = userdepts;
      this.query.ksmc = deptts[0];
    } else {
      this.deptList.push({ label: "全部", value: "" });
    }
    this.deptList.push(...deptts.map((it: any) => ({ label: it, value: it })))
  }
  private changeFilter(e) {
    // console.log(UserModule);

    let data = {
      ...e,
    };
    for (let key in data) {
      if (!data[key] && data[key] != 0) delete data[key];
    }
    this.query = data;
    setTimeout(() => {
      this.activeName === "rzmx"
        ? (<any>this.$refs.rzmx).getData()
        : this.activeName === "rzhz"
          ? (<any>this.$refs.rzhz).getData()
          : (<any>this.$refs.deptHz).getData();
    }, 100);
  }
}
</script>

<style lang="scss" scoped>
.app-container {
  padding: 0 10px;
}
</style>
